﻿@{
    ViewData["Title"] = "证件照尺寸切换";

    var sizeSelectList = new List<SelectListItem>()
{
        new SelectListItem(){ Text="自定义",Value="0"},
        new SelectListItem(){ Text="一寸",Value="1"},
        new SelectListItem(){ Text="两寸",Value="2"},
    };
}

<div class="content">
    <div class="content-body">
        <div class="tool-title clearfix">
            <h1 class="tool-name">证件照尺寸切换</h1>
        </div>
        <div class="tool-form">
            <div class="alert-msg alert alert-danger tp10" style="display:none;">
                请选择上传图片
            </div>
            <form asp-action="updateimagesize" asp-controller="home"
                  enctype="multipart/form-data" data-ajax="true" data-ajax-success="ImageSizeOnSuccess" data-ajax-failure="onFailed" data-ajax-method="post">
                <input type="hidden" name="OldPath" value="" />
                <div class="img-select">
                    <img src="/images/img-0.png" id="qr-canvas" width="120" height="120" alt="选择图片" />
                    <input type="file" name="files" accept="image/*" onchange="ImageSizeUploadImage(this)" title="选择图片">
                    <p>选择图片</p>
                </div>
                <div class="img-select" style="">
                    @Html.DropDownList("type", sizeSelectList, new { @class = "form-control image-select-size" })
                    <span class="flex1">宽：<input type="text" name="width" class="form-control" style="margin-right:5px" />px</span>
                    <span class="flex1">高：<input type="text" name="height" class="form-control" style="margin-right:5px" />px</span>
                    <div class="wp100 tp10">
                        <a href="javascript:;" class="a-btn" onclick="$('form').submit()">转换</a>
                    </div>
                </div>
                <div class="img-select">
                    <img src="/images/img-0.png" width="120" height="120" class="show-img" alt="效果图" />
                    <div class="wp100 tp10">
                        <a href="javascript:;" class="a-btn down-btn" target="_blank">保存</a>
                    </div>
                </div>
                <div id="tool-result" class="hide"></div>
            </form>
        </div>
        <div class="wwads-cn wwads-horizontal" data-id="102" style="max-width:100%"></div>
        <div class="tool-info">
            @*<h5>相关知识</h5>
                <p>本工具对图像进行处理，部分浏览器不支持。</p>*@
        </div>

    </div>
</div>

@section scripts{
    <script src="~/js/jquery-validate/jquery.unobtrusive-ajax.js"></script>
    <script src="~/js/public.js"></script>
}